<template>
    <div id="dailog">
        <div class="container">
            <div class="box">
                <span>功能暂未开发，敬请期待！</span>
                <br>
                <button @click="toParentValue" class="btn">关闭</button>
            </div>
        </div>
    </div>
</template>

<script>
import "@/assets/css/global.css"
export default{
    name:'Dailog',
    methods:{
        toParentValue(){
            this.$emit("sentDailogValue",false)
            console.log(false)
        },
    }

}
</script>

<style scoped>

    #dailog{
        position: absolute;
        z-index:1000;
    }    

    .container{
        height: 100vh;
        width: 100vw;
        background-color: rgba(250, 250, 250, 1);
        opacity: 0.8;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .box{
        padding: 30px 50px;
        background-color: white;
        border: rgba(128, 128, 128, 1);
        border-radius: 4px;
    }

    .btn{
        margin-top: 10px;
        width: 100%;
        padding: 15px 30px;
        color: rgba(0, 179, 138, 1);
        background-color: transparent;
        border: rgba(0, 179, 138, 1) solid 1px;
        border-radius: 4px;
    }

    .btn:hover{
        cursor: pointer;
        color: white;
        background-color: rgba(0, 179, 138, 1);
    }

</style>